<div class="form-container">
    <form name="new_photo_form" method="post" enctype="multipart/form-data" action="{if isset($new_photo_form_action)}{$new_photo_form_action}{/if}">
        <input type="file" name="photo" />

        <div class="btn-box-single">
            <button>Загрузить</button>
        </div>
    </form>
    <div class="form-label single-photo">Загрузить одно фото</div>
</div>

<div class="form-container">
    <div class="hint">
        Рекомендации: использовать имена файлов без пробелов и русских букв
    </div>
    <form name="new_photos_form">
        <div class="file-select">
            <input type="file" name="multiload" />
        </div>
    </form>
    <div class="form-label multiple-photo">Загрузить несколько фото</div>
</div>

<input name="grid_unit" value="{if isset($grid_unit)}{$grid_unit}{/if}" type="hidden" />
<input name="grid_name" value="{if isset($grid_name)}{$grid_name}{/if}" type="hidden" />

<table id='{if isset($grid_unit)}{$grid_unit}{/if}_grid'></table>
<div id='{if isset($grid_unit)}{$grid_unit}{/if}_pager'></div>

{if isset($photo_grid)}{$photo_grid}{/if}



{*}TODO вынести этот код в внешний скрипт {/*}
<script>

    $( "input[name=multiload]" ).parent().prepend( "<div class='btn-box'><button name='valim_optom' class='upload-multiple-files'>Загрузить</button></div>" );
    $( "input[name=multiload]" ).parent().prepend( "<div class='multiload-box'></div>" );


    $("input[name=multiload]").fileupload({
        url:"{$smarty.const.PUBLIC_URL}/repairs/multiload",
        success:function(dat){
            if(dat.status == 'ok') {

                var text = $('.multiload-box').html();

                var item = "<div class='upload-item'>" +
                        "<span>"+ dat.filename +"</span>" +
                        "       <img src='"+dat.file+"'  />" +
                        "   </div>";
                $('.multiload-box').html(text + item);
            }
        },
        dataType:'json'
    });



    function multisave(e){

        data = 'save'

        $.ajax({
            type: "POST",
            url: "{$smarty.const.PUBLIC_URL}/{if isset($unit)}{$unit}{/if}/multisave",
            data: data,
            success: function(dat){
                jQuery("#" + "{if isset($grid_name)}{$grid_name}{/if}").trigger('reloadGrid');
                $('.multiload-box').html('');
            },
            dataType: 'json'
        });

    }

    $("button[name=valim_optom]").on('click',multisave);

    // --
/*
    jQuery("#photo_dining_grid").jqGrid({
        "viewrecords":"true","recordtext":"Records",
        "rowList":["10","20","25","500","1000"],
        "datatype":"json","loadui":"block",
        "hoverrows":"true","resizable":"true","loadtext":"Loading...","rowNum":"10",
        "forceFit":"true","sortname":"photo:photo_id","sortorder":"desc","width":"100%","hidegrid":"true",
        "height":"450","0":"auto",
        "caption":"\u041a\u0443\u0445\u043d\u0438","pager":"photo_dining_pager",
        "autowidth":"true",
        "colNames":["\u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0430",
            "\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435",
            "\u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435",
            "\u0424\u043e\u0442\u043e","\u041f\u043e\u0440\u044f\u0434\u043e\u043a",
            "\u0414\u0435\u0439\u0441\u0442\u0432\u0438\u044f"],
        "colModel":
                [{
                    "name":"date_added","index":"date_added",
                    "title":"\u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0430",
                     "sortable":"true","width":"55",
                    "editable":"false",
                    "formatter":"changeTitle"},
                    {
                        "name":"title","index":"title","title":"\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435",
                        "sortable":"true",
                        "width":"55","editable":"true"},
                    {
                        "name":"text","index":"text","title":"\u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435",
                        "sortable":"true","width":"55","edittype":"textarea",
                        "editable":"true"},
                    {
                        "editoptions":
                        {
                            "dataUrl":"core\/login\/zxc",
                            "src":""},"name":"link",
                        "index":"link","title":"\u0424\u043e\u0442\u043e",
                        "sortable":"true","width":"55","editable":"true",
                        "align":"center","edittype":"image",
                        "formatter":"imageFormat"},
                    {
                        "name":"sort","index":"sort","title":"\u041f\u043e\u0440\u044f\u0434\u043e\u043a",
                        "sortable":"true","width":"15","editable":"true"},
                    {
                        "name":"actions","index":"actions","title":"\u0414\u0435\u0439\u0441\u0442\u0432\u0438\u044f",
                        "sortable":"true","editable":"true","width":"40"}],
        "url":"http:\/\/admin.remontik.kh.ua\/dining\/getphoto",
        "editurl":"http:\/\/admin.remontik.kh.ua\/dining\/editCell","mtype":"POST",
        "imgpath":"http:\/\/admin.remontik.kh.uagrid\/themes\/basic\/images"});jQuery("#photo_dining_grid").jqGrid('navGrid','#photo_dining_pager',
            {
                "edit":"true","add":"true","del":"true","search":"true"});;

    jQuery.jgrid.edit = {
        "addCaption":"Add Record","editCaption":"\u0420\u0435\u0434\u0430\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c",
        "bSubmit":"\u0421\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u044c",
        "bCancel":"\u041e\u0442\u043c\u0435\u043d\u0430",
        "bClose":"\u0417\u0430\u043a\u0440\u044b\u0442\u044c","saveData":"Data has been changed! Save changes?",
        "bYes ":"\u0414\u0430","bNo ":"\u041d\u0435\u0442","bExit ":"\u041e\u0442\u043c\u0435\u043d\u0430",
        "closeAfterAdd":"true","closeAfterEdit":"true","msg":"Error","width":460}
    function imageFormat( cellvalue, options, rowObject ){
        alert('imageFormat')
        return '<img src="'+cellvalue+'" />';
    }
    function imageUnFormat( cellvalue, options, cell){
        return $('img', cell).attr('src');
    }
*/
</script>
